
<template>
  <main>
    <h1>Home</h1>
   
    <p v-for="(item,index) in list" :key="index+item.docid">
    {{ item.title }}
       
    </p>
   
  </main>
</template>
<script setup>

// ref 定义响应式数据
  import { ref } from 'vue'
// page当前第几页
  const page = ref(1)
// list 新闻列表数据
  const list = ref([])
// 获取新闻数据的方法
  function getNews() {
    // 获取数据(fetch ES6新增的原生ajax请求方法)
    fetch(`http://dida100.com/mi/list.php?page=${page.value}&channel_id=c6`)
    // get请求拿到的数据流 res.json() 转换为json数据  res.text() 转换为文本
    .then(res=>res.json())
    // 获取到转换后的数据
    .then(res=>{     
      list.value = res.result;
      
    })
    // 获取失败执行catch方法
    .catch(err=>console.log(err))
   } 
   getNews();
  // page 当前页面 //list存储页面数据
  // getNews() 获取数据 
 
</script>
